---
title: Astroサイトのデプロイ
description: WebにAstroサイトをデプロイする方法。
---
import DeployGuidesNav from '~/components/DeployGuidesNav.astro';
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
import { Steps } from '@astrojs/starlight/components'

**Astroサイトをビルド・デプロイする準備ができましたか？** さまざまなデプロイサービスのガイドに従うか、スクロールしてAstroサイトをデプロイする全般的なガイダンスを参照してください。

## デプロイガイド

<DeployGuidesNav />

## クイックデプロイ・オプション

Astroのサイトは、WebサイトのダッシュボードUIまたはCLIを使用して、多くのホストに短時間でビルド・デプロイできます。

### WebサイトUI

Webサイトをデプロイする手っ取り早い方法は、AstroプロジェクトのオンラインGitリポジトリ（例：GitHub, GitLab, Bitbucket）をホストプロバイダーに接続し、Gitを使用した継続的デプロイを使用することです。

これらのホストプラットフォームは自動的にAstroプロジェクトのソースリポジトリへのプッシュを検出し、サイトをビルドして、カスタムURLまたは個人のドメインでWebにデプロイします。多くの場合、これらのプラットフォームにおけるデプロイの設定は以下のような手順に従います：

<Steps>
1. リポジトリをオンラインのGitプロバイダー（例：GitHub, GitLab, Bitbucket）に追加してください。

2. **継続的デプロイ**をサポートするホスト（例：[Netlify](/ja/guides/deploy/netlify/) または [Vercel](/ja/guides/deploy/vercel/)）を選択し、新しいサイト/プロジェクトとしてGitリポジトリをインポートしてください。

    多くの一般的なホストはプロジェクトをAstroサイトとして認識し、以下のようにビルド・デプロイに適切な構成設定を選択するはずです。（もしそうでない場合は、これらの設定は変更できます。）

    :::note[デプロイの設定]
    - **ビルドコマンド:** `astro build` または `npm run build`
    - **公開ディレクトリ:** `dist`
    :::

3. 「デプロイ」をクリックすると、新しいWebサイトがそのホストのユニークなURLに作成されます（例： `new-astro-site.netlify.app`）。
</Steps>

ホストはGitプロバイダーのmainブランチの変更を監視し、新しいコミットがあるたびにサイトを再ビルド・再公開するよう自動的に設定します。これらの設定は通常、ホストプロバイダーのダッシュボードUI上で行うことができます。

### CLIを使用したデプロイ

いくつかのホストは、npmを使用したあなたのマシンにグローバルにインストールできる独自のコマンドライン・インターフェース（CLI）を備えています。多くの場合、CLIを使用してデプロイする方法は以下のようになります:

<Steps>
1. ホストのCLIをグローバルにインストールします。例：

    <PackageManagerTabs>
        <Fragment slot="npm">
        ```shell
        npm install --global netlify-cli
        ```
        </Fragment>
        <Fragment slot="pnpm">
        ```shell
        pnpm add --global netlify-cli
        ```
        </Fragment>
        <Fragment slot="yarn">
        ```shell
        yarn global add netlify-cli
        ```
        </Fragment>
      </PackageManagerTabs>

2. CLIを実行し、認証、セットアップ等の指示に従います。

3. サイトをビルドしてホストにデプロイします。

   多くの一般的なホストは、サイトをビルドしデプロイしてくれます。それらは通常、プロジェクトをAstroサイトとして認識し、以下のようにビルド・デプロイのための適切な設定を選択するはずです。（もしそうでない場合は、これらの設定は変更可能です。）

    :::note[デプロイの設定]
    - **ビルドコマンド:** `astro build` or `npm run build`
    - **公開ディレクトリ:** `dist`
    :::

    その他のホストでは[ローカルでサイトをビルド](#ローカルでサイトをビルドする)しコマンドラインを使用してデプロイする必要があります。
</Steps>

## ローカルでサイトをビルドする

NetlifyやVercelのような多くのホストはサイトをビルドしてそのビルド出力をWebに公開してくれます。しかし、サイトによっては、ローカルでビルドし、デプロイコマンドを実行するか、ビルド出力をアップロードする必要があります。

また、ローカルでビルドしてサイトをプレビューしたり、潜在的なエラーや警告を自分の環境でキャッチしたりすることもできます。

Astroサイトをビルドするには、`npm run build`コマンドを実行してください。

    <PackageManagerTabs>
    <Fragment slot="npm">
    ```shell
    npm run build
    ```
    </Fragment>
    <Fragment slot="pnpm">
    ```shell
    pnpm run build
    ```
    </Fragment>
    <Fragment slot="yarn">
    ```shell
    yarn run build
    ```
    </Fragment>
  </PackageManagerTabs>

デフォルトでは、ビルド出力は`dist/`に配置されます。この場所は[`outDir`設定オプション](/ja/reference/configuration-reference/#outdir)を使って変更できます。

## SSR用アダプターを追加する

:::note
[SSR（サーバーサイド・レンダリング）](/ja/guides/server-side-rendering/)を有効化してAstroサイトをデプロイする前に、確認してください:

- [適切なアダプター](/ja/guides/server-side-rendering/)がプロジェクトの依存関係にインストールされていること（手動、またはアダプターの`astro add`コマンドを使用します。例: `npx astro add netlify`）
- 手動インストール時に`astro.config.mjs`ファイルのimportとdefault exportに[アダプター](/ja/reference/configuration-reference/#integrations)を追加していること（このステップは `astro add` コマンドが代行します！）
:::
